.page {
    width: 750rpx;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--themeBgColor);

    .nav {
        width: 100vw;
        background-color: #fff;
    }
}

.tip {
    width: 100vw;
    height: 50rpx;
    color: #ed6a0c;
    font-size: 28rpx;
    background-color: #fffbe8;
    display: flex;
    align-items: center;
    justify-content: center;

    .icon {
        position: absolute;
        right: 20rpx;
    }

}

.hearder {
    width: 750rpx;
    height: 270rpx;
    color: #424242;
    background-color: #fff;
    padding: 20rpx 0;
    margin-bottom: 20rpx;

    .top {
        padding: 0 30rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .label {
            color: #959595;
        }

        .type {
            font-size: 30rpx;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;

            .alarm {
                color: #ff7676;
                margin-left: 20rpx;
            }
        }

        .btns {
            white-space: nowrap;

            .btn {
                height: 54rpx;
                font-size: 22rpx;
                color: #dad8fb;
                margin-left: 20rpx;
                border-radius: 15rpx;
            }
        }
    }

    .bottom {
        width: 680rpx;
        font-size: 28rpx;
        margin-left: 30rpx;

        .label {
            color: #959595;
        }

        .msg {
            margin: 12rpx 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;

            .status1 {
                color: #ff7676;
            }

            .status2 {
                color: #FFAF66;
            }

            .status3 {
                color: #07c160;
            }
        }
    }
}

.main {
    width: 100vw;

    .list {
        width: 100vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        .item {
            width: 640rpx;
            background-color: #fff;
            margin-bottom: 20rpx;
            padding: 30rpx;
            border-radius: 20rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;

            .left {
                color: #424242;
                font-size: 30rpx;

                .label {
                    color: #959595;
                }

                view {
                    margin: 8rpx 0;
                }
            }

            .right {
                width: 150rpx;
                display: flex;
                justify-content: space-between;
                align-items: center;

                .image {
                    width: 130rpx;
                    height: 130rpx;
                    margin-left: 10rpx;
                    border-radius: 10rpx;
                }
            }
        }
    }

    .scroll-bottom-txt {
        width: 750rpx;
        // margin-top: 10rpx;
        display: flex;
        align-items: center;
        justify-content: center;
    }

}